<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="static/css/common.css"/>
<script type="text/javascript" src="static/js/common.js"></script> 
<title>欢迎注册</title>
<script type="text/javascript">
	var result = "";
	var flag;
	function checkName(){
		//获取name的值
		var oName = document.getElementById("nameId").value;
		var onameSpan = document.getElementById("nameSpan");
		onameSpan.innerHTML = "";
		var nameReg = /^[a-z]\w{3,7}$/i;
		if(nameReg.test(oName)){
			//满足后，检测是否已经存在
			var func = CallBackFunc;
			AjaxName(oName,func);
			
		}else{
			onameSpan.innerHTML = "用户名不符合规范".fontcolor("red");
		}
	}
	
	function CallBackFunc(results){
		alert("CallBackFunc");
		result = results;
		alert(result);
		if(result == "yes"){
			flag = false;
		}else{
			flag = true;
		}
		
		alert("CallBackFunc flag = "+flag)
		return flag;
	}
	
	function AjaxName(oName,callBack){
		//1、ajax
		alert("AjaxName");
		var ajax = createAjax();
		var url = "${pageContext.request.contextPath}/admin?name="+oName+"&action=checkName&time="+new Date().getTime();
		ajax.open("GET",url);
		ajax.send(null);
		
		ajax.onreadystatechange = function(){
			if(ajax.readyState == 4 && ajax.status == 200){
				var results = ajax.responseText;
				alert("results = "+results);
				var oName = document.getElementById("nameId");
				if(results == "yes"){
				   oName.value = "";
				   oName.focus();
				}
			
				//callBack(results);
			}
		}
		 return;
		
	}
</script>
</head>
<body>
  
  <table width="500px">
  	<form action="${pageContext.request.contextPath}/admin?action=register" method="post">
  	<div align="right"><a href="${pageContext.request.contextPath}/login.jsp">用户登录</a></div>
  	<caption><h3>用户注册</h3></caption>
  	
  	<tr>
  		<th>用户名</th>
  		<td>
  			<input type="text" name="name" id="nameId" onblur="checkName()"/>
  		    <span id="nameSpan"></span>
  		</td>
  	</tr>
  	
  	<tr>
  		<th>密码</th>
  		<td><input type="password" name="password"/></td>
  	</tr>
  	
  	<tr align="center">
  		<td colspan="2">
  			<input type="submit" value="注 册"/>
  			<input type="reset" value="重 置"/>
  			<span class="error">${msg}</span>
  		</td>
  	</tr>
  	
  	</form>
  </table>
    

</body>
</html>